<!DOCTYPE html>
<html>
<head>

    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
    
    <title>Marker Ein / Ausblenden</title>
    
    <link href="http://code.google.com/apis/maps/documentation/javascript/examples/default.css" 
          rel="stylesheet" 
          type="text/css" />
          
    <!-- Google Maps API -->
    <script type="text/javascript" 
		src="http://maps.google.com/maps/api/js?v=3.5&sensor=false">
    </script>  
    
    <script type="text/javascript">
    
	  // Marker
      var marker = new google.maps.Marker;
      
	  // Array von Markern
	  var gmarkers = [];
    
      function initialize() {
		  
		// Markerpositionen
        var myLatlng = new google.maps.LatLng(52.5234051,13.411399);
        var myLatlng2 = new google.maps.LatLng(52.6234051,13.411399);
		
		// Kartenoptionen
        var myOptions = {
          zoom: 11,
          center: myLatlng,
          mapTypeId: google.maps.MapTypeId.ROADMAP
        }
		
		// Karte initialisieren
        var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
        
		// Marker auf der Karte setzen
        marker = new google.maps.Marker({
            position: myLatlng, 
            map: map,
            title:"Hello World!",
            art: "testwert"
        }); 
        
		// Marker in Array ablegen
        gmarkers.push(marker);
        
		// Marker auf der Karte setzen
        marker = new google.maps.Marker({
            position: myLatlng2, 
            map: map,
            title:"Hello World!",
            art: "testwert"
        }); 
        
		// Marker in Array abspeichern
        gmarkers.push(marker);
  
      }

      // Funktion die alle Marker von der Karte ausblendet
      function verstecke(){
          for (var i = 0; i < gmarkers.length; i++) {
            if(gmarkers[i].art == "testwert"){
                gmarkers[i].setVisible(false);
            }
          }
      }
      
      // Funktion die alle Marker auf der Karte anzeigt
      function zeige(){
          for (var i = 0; i < gmarkers.length; i++) {
            gmarkers[i].setVisible(true);
          }
      }
      
    </script>

</head>

<body onload="initialize()">

	<!-- Kartendarstellung -->
	<div id="map_canvas" style="float:left;width:70%;height:100%;">
    
    </div>
    
    <!-- Steuerung -->
 	<div id="directions_panel" style="margin:20px;background-color:#FFEE77;">
  		<input type="button" onClick="verstecke();" value="Ausblenden">
		<input type="button" onClick="zeige();" value="Einblenden">
	</div>
  
</body>

</html>
